<template>
  <div id="generateDiv">
    <template v-if="printRead">
      {{
        ((typeof dataModel == 'object') && dataModel ? dataModel.map(dm => widget.options.options.find(item => item.value === dm) && widget.options.options.find(item => item.value === dm).label).join('、') : (widget.options.options.find(item => item.value === dataModel) && widget.options.options.find(item => item.value === dataModel).label)) || '暂无数据'
      }}
    </template>
    <template v-else>
      <el-select :ref="`icd-form-${widget.model}`"
                 @change="changeValue($event)"
                 v-model="dataModel"
                 :clearable="widget.options.clearable"
                 :disabled="printRead||!edit || widget.options.disabled"
                 :placeholder="widget.options.placeholder"
                 :style="{width: widget.options.isWidgetWidth ? `${widget.options.width}%` : '100%' }">
        <el-option v-for="(item, index) in widget.options.options" :key="item.value + index" :label="item.label" :value="item.value">
        </el-option>
      </el-select>
    </template>
  </div>
</template>

<script>
export default {
  name: 'select_JCK18LBm-generate',
  components: {

  },
  props: ['widget',
    'value',
    'models',
    'remote',
    'isTable',
    'disabled',
    'edit',
    'remoteOptionSource',
    'rules',
    'platform',
    'preview',
    'dataSourceValue',
    'eventFunction',
    'rowIndex',
    'tableName',
    'printRead'],
  mounted () {
    // value进来的时候是数组形式，所以要取一下
    this.dataModel = this.value[0];
  },
  data () {
    return {
      dataModel: this.value[0]
    };
  },
  watch: {
    value (val) {
      this.dataModel = val[0];
    }
  },
  methods: {
    changeValue (value) {
      // 出去的时候包装成数组形式
      const array = [];
      array.push(value);
      this.$emit('input', array);
    }
  }
};
</script>
<style scoped>
#generateDiv {

}
</style>
